<template>
  <div class="ChangePassword">
    <div class="main_top">
      <el-form :label-position="labelPosition" label-width="120px" :model="formLabelAlign">
        <el-form-item label>
          <h1>修改密码</h1>
        </el-form-item>
        <el-form-item label="旧密码">
          <el-input style="width: 280px;" placeholder="输入您的当前密码" v-model="formLabelAlign.oldPassword"></el-input>
        </el-form-item>
        <el-form-item label="新密码">
          <el-input style="width: 280px;" placeholder="至少六位" v-model="formLabelAlign.newPassword"></el-input>
        </el-form-item>
       
        <el-form-item label>
          <el-button @click="getsave" type="primary">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
import { getList } from "@/api/table";
import { updatePassword } from "@/api/user";
import qs from "qs";
import { mapGetters, mapState } from "vuex";
export default {
  data() {
    return {
      labelPosition: "right",
      formLabelAlign: {
        oldPassword: "",
        newPassword: "",
       
      }
    };
  },
  computed: {
    ...mapState(["userMsg"])
  },
  methods: {
    getsave(){
      if(this.oldPassword ==""){
         this.$message.error("新密码不能为空")
      }else if(this.oldPassword.lenght<6){
         this.$message.error("密码不能小于6位")  
      }else if(this.newPassword != this.oldPassword){
          this.$message.error("新密码与旧密码不相同")
      }
       let data = qs.stringify({
       id:this.userMsg.id,
       oldPassword:this.formLabelAlign.oldPassword,
       newPassword:this.formLabelAlign.newPassword
      });
      updatePassword(data).then(res => {
        console.log(res.data, 888);
        if (res.data.code == 200) {
          this.$message.error("修改成功")
        } else {
          this.$message.error(res.data.msg);
        }
      });
    }
  }
};
</script>

<style lang="less" scoped>
.ChangePassword {
  .main_top {
    margin: 100px 200px;
  }
}
</style>